<!DOCTYPE html>
<!-- es2017的新语法-->
<!-- async 用于申明一个 function 是异步的，而 await 用于等待一个异步方法执行完成。 -->
<!-- await 只能出现在 async 函数中 -->
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        async function testAsync() {
            return 0;
        }
        // return的是一个promise对象 并不是0
        console.log('testAsync()',testAsync());

        // 如果在函数中 return 一个直接量，async 会把这个直接量通过 Promise.resolve(res) 封装成 Promise 对象。
        testAsync().then(res => console.log(res))


        async function testAsync2() {
            console.log('testAsync2','hello async');
        }
        // 返回一个promise
        console.log(testAsync2());
        // 如果函数没有返回值 封装的是Promise.reslove(undefined)
        testAsync2().then(res => console.log(res))
        

        /* 
        await后面可以跟任何的表达式
        如果它等到的不是一个 Promise 对象，那 await 表达式的运算结果就是它等到的东西
        如果它等到的是一个 Promise 对象，它会阻塞后面的代码，等着 Promise 对象 resolve，然后得到 resolve 的值，作为 await 表达式的运算结果。
        */

        function goRequest() {
            return new Promise(reslove => {
                setTimeout(() => {
                    reslove('request success')
                }, 1000);
            })
        }

        async function test() {
            const b = await 20;
            console.log(b, '这段代码没有被阻塞');
            const v = await goRequest()
            console.log('这段代码被阻塞了');
            console.log('v', v);
        }
        test()
    </script>
</body>

</html>